var demo;
var out;
let json;
json = {
    "title": "newFlow_1",
    "nodes": {
        "demo_node_1": {
            "name": "开始",
            "left": 411,
            "top": 99,
            "type": "start round",
            "width": 24,
            "height": 24,
            "alt": true
        },
        "demo_node_2": {
            "name": "结束",
            "left": 418,
            "top": 440,
            "type": "end round",
            "width": 24,
            "height": 24,
            "alt": true
        },
        "demo_node_3": {
            "name": "用人部门",
            "left": 417,
            "top": 181,
            "type": "task round",
            "width": 24,
            "height": 24,
            "alt": true
        },
        "demo_node_4": {
            "name": "综合管理部",
            "left": 412,
            "top": 263,
            "type": "task round",
            "width": 24,
            "height": 24,
            "alt": true
        },
        "demo_node_5": {
            "name": "安全环保部",
            "left": 419,
            "top": 352,
            "type": "task round",
            "width": 24,
            "height": 24,
            "alt": true
        },
        "demo_node_6": {
            "name": "分管领导",
            "left": 419,
            "top": 352,
            "type": "task round",
            "width": 24,
            "height": 24,
            "alt": true
        },
        "demo_node_7": {
            "name": "总经理",
            "left": 419,
            "top": 352,
            "type": "task round",
            "width": 24,
            "height": 24,
            "alt": true
        }
    },
    "lines": {
        "demo_line_6": {"type": "sl", "from": "demo_node_1", "to": "demo_node_3", "name": "", "alt": true},
        "demo_line_7": {"type": "sl", "from": "demo_node_3", "to": "demo_node_4", "name": "", "alt": true},
        "demo_line_8": {"type": "sl", "from": "demo_node_4", "to": "demo_node_5", "name": "", "alt": true},
        "demo_line_9": {"type": "sl", "from": "demo_node_5", "to": "demo_node_2", "name": "", "alt": true}
    },
    "areas": {},
    "initNum": 10
}
var property = {
    width: 1200,
    height: 600,
    haveHead: false,
    haveTool: true,
    haveGroup: false,
    useOperStack: false
};
$(document).ready(function () {
    initFlow()
    demo.loadData(json);
    drawFlow();
});

function initFlow() {
    demo = $.createGooFlow($("#demo"), property);
    $(".GooFlow_tool").empty();
    demo.onItemFocus = function (id, model) {
        var obj;
        $("#model").val(model);
        $("#id").val(id);
        if (model == "line") {
            // obj = this.$lineData[id];
            // $("#type").val(obj.M);
            // $("#left").val("");
            // $("#top").val("");
            // $("#width").val("");
            // $("#height").val("");
            // $("#from").val(obj.from);
            // $("#to").val(obj.to);
        } else if (model == "node") {
            obj = this.$nodeData[id];
            // $("#type").val(obj.type);
            // $("#left").val(obj.left);
            // $("#top").val(obj.top);
            // $("#width").val(obj.width);
            // $("#height").val(obj.height);
            // $("#height").val(obj.remark);
            // $("#from").val("");
            // $("#to").val("");
            $("#name").val(obj.name);
            $("#remark").val(obj.remark);
            $("#result2").val(obj.result == 1 ? '同意' : (obj.result == 2 ? '待阅' : '不同意'));
        }

        return true;
    };
    demo.onItemBlur = function (id, model) {
        document.getElementById("propertyForm").reset();
        return true;
    };
}

function drawFlow() {
    let nodes = json.nodes;
    //流程已办
    Object.keys(nodes).forEach(item => {
        if (!(item == 'demo_node_1' || item == 'demo_node_2')) {
            if (nodes[item].result == 1) {
                $("#" + item).css({'background-color': "green"});
            } else if (nodes[item].result == 0) {
                $("#" + item).css({'background-color': "red"});
            }
        }
        ;
    });
    //下个节点
    json.flowInfo.nextNodes.forEach(item => {
        $("#" + item).css({'background-color': "yellow"});
    })
}
